<template>
    <div class="tabBox">
        <router-link class="item" to="/collection">所有藏品</router-link>
        <router-link class="item" to="/gallery">艺术长廊</router-link>
        <router-link class="item" to="/auction">拍卖会</router-link>
        <router-link class="item" to="/artist">艺术家</router-link>
        <router-link class="item" to="/landmark">AR地标</router-link>
    </div>
</template>

<script>
import { reactive,toRefs,getCurrentInstance } from 'vue'
import {useRoute,useRouter} from 'vue-router'
import { useStore } from 'vuex'

export default {
    components:{
       
    },
    props:{

    },
    setup(props,context){
        const router = useRouter()
        const route = useRoute()
        const store = useStore()
        const {proxy} = getCurrentInstance()

        const state = reactive({
            
        })

        return{
            ...toRefs(state)
        }
    }
}
</script>

<style lang="scss" scoped>
    .tabBox{
        display: flex;
        height: 100px;
        background: #eee;
        margin: 0 0 20px 0;
        .item{
            text-align: center;
            flex: 1;
            border: 1px solid red;
            padding: 20px 0 0 0;
        }
    }
</style>